import { ref, computed, watchEffect } from 'vue';
export const useComputed = (props, emits) => {
  /**
   * @description: 获取所有的插槽
   * @param: Array 所有数组
   * @returns: Array 插槽数组
   */
  const getSlots = computed(() => {
    return list => {
      let slotNames = [];
      list &&
        list.map(item => {
          if (item.itemSlot) slotNames.push({ slot: item.itemSlot, ...item });
          if (item.slot) slotNames.push({ slot: item.slot, ...item });
        });
      return slotNames;
    };
  });
  /**
   * @description: 单个col的宽度样式
   * @param: 单个col的所有数据
   * @returns: col的样式对象
   */
  const colAttrs = computed(() => {
    const { col = {} } = props.dataSource || {};
    return { span: 6, ...col };
  });
  /**
   * @description: 计算单个item的label宽度
   * @param: 外部form的labelWidth number
   * @param: 单个col的数据
   * @returns: labelWidth number
   */
  const getLabelWidth = computed(() => {
    return labelWidth => {
      return props.dataSource.labelWidth || labelWidth;
    };
  });
  /**
   * @description:  每一个item禁止输入单独计算
   * @param: 入参中的disabled<boolean>
   * @returns: boolean
   */
  const getDisabled = computed(() => {
    return disabled => {
      return props.dataSource.disabled || disabled;
    };
  });
  /**
   * @description:  每一个item只读
   * @param: 入参中的readonly<boolean>
   * @returns: boolean
   */
  const getReadonly = computed(() => {
    return readonly => {
      return props.dataSource.readonly || readonly;
    };
  });
  /**
   * @description: 每一个item设置为红色
   * @param: 入参中的update<boolean>
   * @returns: boolean
   */
  const getUpdate = computed(() => {
    return (update, isUpdate) => {
      if (update) {
        return props.dataSource.hasOwnProperty('update') ? props.dataSource.update && isUpdate : isUpdate;
      } else {
        return false;
      }
    };
  });
  /**
   * @description: 判断每一个item是否有清空功能
   * @returns: boolean
   */
  const getClearable = () => {
    return props.dataSource.clearable == false ? false : true;
  };
  /**
   * @description: 字典项格式化
   * @param: [{dictName: XXX, dictCode: YYY}]
   * @returns: [{name:XXX,value:YYY}]
   */
  const getOpts = computed(() => {
    return dits => {
      if (dits.dictCode) {
        const options = props.dictData[dits.dictCode] || [];
        return options.map(item => {
          return { name: item.dictName, value: item.dictCode };
        });
      }
      if (dits.options && typeof dits.options === 'function') {
        return dits.options() || [];
      }
      return dits.options || [];
    };
  });

  const getCascaderOption = computed(() => {
    return dits => {
      if (dits.options && typeof dits.options === 'function') {
        return dits.options() || [];
      }
      return dits.options || [];
    };
  });

  return {
    getSlots,
    colAttrs,
    getLabelWidth,
    getDisabled,
    getReadonly,
    getOpts,
    getCascaderOption,
    getClearable,
    getUpdate,
  };
};
